<template>
	<view>
		<uni-nav-bar left-img="back" @clickLeft="back" >
			<view class="border weui-flex" style="margin:5px 0px;">
				<view style="padding-right:10px;">
					<image src="../../static/search.png" style="height:18px;margin-top:7px;" mode="heightFix"></image>
				</view>
				<view class="weui-flex__item">
					<input v-model="keyword" placeholder="请输入手机号或姓名" class="input-search" style="height:24px;line-height:24px;padding-top:4px;text-align: left;" />
				</view>
			</view>
			<text slot="right" @click="search()">搜索</text>
		</uni-nav-bar>
		<view class="weui-margin-full">
			<view class="guest" v-if="lists.length>0">
				<view class="weui-flex list-item" v-for="(item,index) in lists" :key="index" @click="handleNav(item.id)">
					<view class="weui-flex__item">
						<text style="padding-right:5px;">{{item.nickName}}</text>
						<!-- <text class="tag">来店{{item.storeCount}}次</text> -->
					</view>
					<view>{{item.tell}}</view>
				</view>
			</view>
			<view v-else style="text-align:center;margin-top:100px;">
				<view v-if="showResult && keyword!=''" >
					<image src="../../static/empty.png" style="width:150px;" mode="widthFix"></image>
					<view style="padding-top:15px;text-align: center;color: #999999;">搜索无结果 </view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		components: { },
		data() {
			return {
				keyword:'',
				showResult:false,
				lists:[]
			}
		},
		watch: {
		   keyword(newV,oldV) {
			  if(newV==''){
				this.showResult = false;
				this.lists = [];
			  }
		   }
		},
		onLoad(e) {
			this.$users.checkLogin();
		},
		onShow(){
			let _this = this;
			_this.handleSugoioLoad('顾客档案搜索', 'guest-search')
		},
		methods: {
			handleNav(id) {
				this.$common.to("/pages/skin/guest-record?id=" + id);
			},
			search(){
				if(this.keyword==''){
					this.$common.toast("请输入手机号或姓名");
					this.showResult = false;
					this.lists = [];
				}else{
					var tell = "";
					var nickName = "";
					var reg = /^[0-9]*$/;
					if (reg.test(this.keyword)) {
						tell = this.keyword.toString();
					}else{
						nickName = this.keyword.toString();
					}
					this.$common.initAjax({
						url:"customer/name?assistantShop=" + this.$users.ID + "&tell=" + tell + "&nick_name=" + nickName,
						type:"post",
						success:(res)=>{
							this.showResult = true;
							if(res.flag==0){
								var tabItems = [];
								this.lists = res.data.rows;
								console.log(this.lists );
							}
							
						}
					});
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.input-search /deep/ .uni-input-input{
		color: #FFFFFF;
	}

	.uni-input-placeholder{
		color: #FFFFFF;
		opacity: 0.5;
	}
	.border{
		background: rgba(249, 249, 249, 0.2);
		border:1px solid rgba(249, 249, 249, 0);
		color: #ffffff;
		border-radius:100px;
		height:32px;
		line-height:32px;
		text-align: center;
		padding: 0px 40upx;
	}
</style>
